<!DOCTYPE html>
<html>
<head>
  <title>Bitwin</title>
  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
  <%= csrf_meta_tags %>  
  <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
</head>

<style type="text/css">
.marginTop{
	padding-top: 10px;
}
.colorNavar{
	background: rgb(142, 127, 127);
}
.navbar-default .navbar-nav > li > a{
	color: white!important;
}
</style>

<script type="text/javascript">

	function changeModalDefault(){
		$('#modalSingIn').show();
		$('#modalNew').hide();
	}

	function changeModal(){
		
		$('#modalSingIn').hide();
		$('#modalNew').show();
	}

</script>
<body style="background: black">
	<nav class="navbar navbar-default" role="navigation" style="background: black; border-radius: 36px; border-color: black;" >
		<div class="colorNavar container-fluid" style="border-radius: 7px;">
		<!-- Brand and toggle get grouped for better mobile display -->
		<div class="navbar-header">
		  <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
		    <span class="sr-only">Toggle navigation</span>
		    <span class="icon-bar"></span>
		    <span class="icon-bar"></span>
		    <span class="icon-bar"></span>
		  </button>
		  <div class="col-md-4">
		  <a class="" href="/"><img src="/images/logobitwin.png" alt="" style="width: 118px;
			padding-top: 2px;"></a>
			</div>
		</div>

		<!-- Collect the nav links, forms, and other content for toggling -->
		<div class=" colorNavar collapse navbar-collapse" id="bs-example-navbar-collapse-1">
		  <ul class="nav navbar-nav">
		    <li><a href="/about">Acerca de Nosotros</a>
		    </li>
		   </ul>      
		  
			<% if loggedIn? %>
			 	
			 	<ul class="nav navbar-nav navbar-right">        
			    <li class="dropdown">
			      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><%= currentUser.nickname %><span class="caret"></span></a>
			      <ul class="dropdown-menu" role="menu">
			        <li><a href=""><%= link_to "Configuración", currentUser %></a></li>		
			        <li><a href="/users/<%= currentUser.id %>/gambles">Apuestas</a></li>	  	
			         <li><a href="/users/<%= currentUser.id %>/shoppings/new">Comprar fichas</a></li>	      	
			        <li class="divider"></li>
			        <li><a href="#"><%= link_to "Log out", logout_path, method: "delete" %></a></li>
			      </ul>
			    </li>
			  </ul>
			
			 <% else %>

			 	<ul class="nav navbar-nav navbar-right">
			 	 	<li><a href="#" data-toggle="modal" data-target="#myModal" onclick="changeModalDefault()">Sign in</a></li>	 
			 	</ul>
	     <% end %>
	
		</div><!-- /.navbar-collapse -->
		</div><!-- /.container-fluid -->
		</nav>

	<%= yield %>
	</br>
	 <footer>
	 	<div class="row clearfix">
		<hr>
			<div class="col-md-12 column text-center" style="color: white;">						
				<h4><strong>BitWin</strong></h4>
			<button class="btn btn-facebook"><i class="fa fa-facebook"></i></button>&nbsp;&nbsp;
			<button class="btn btn-twitter"><i class="fa fa-twitter"></i></button>&nbsp;&nbsp;
			<button class="btn btn-google-plus"><i class="fa fa-google-plus"></i></button>&nbsp;&nbsp;
				<br>
				PROHIBIDO EL INGRESO A MENORES DE 18 AÑOS.
				<br>
				2014@COPYRIGHT. TODOS LOS DERECHOS RESERVADOS.
			</div>
		</div>

	 </footer>
	<!--<%= debug(params) if Rails.env.development? %>




<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel">Registrate....</h4>
      </div>
      <div id="modalSingIn" class="modal-body">
        <%= form_for(:session , url: "/login", method: "post") do |f| %>
					<div class="row marginTop">
						<div class="col-md-6">
		      		<%= f.label :nickname %>
		      		<%= f.text_field :nickname, class: 'form-control' %>
						</div>
					</div>
					<div class="row marginTop">
						<div class="col-md-6">
							<%= f.label :password %>
		     			<%= f.password_field :password, class: 'form-control' %>
						</div>
					</div>
					<div class="row marginTop">
						<div class="col-md-6">
		    		  <%= f.submit "Log in", class: "btn btn-primary" %>
						</div>
					</div>
					<div class="row marginTop">
						<div class="col-md-6">
							<p>New user? <a href="#" onclick="changeModal()">Sing up Now!</a></p>
						</div>
					</div>
		    <% end %>
			</div>   


			 <div id="modalNew" class="modal-body" style="display: none">
      	<%= form_for(:user, url: "/users" ) do |f| %>
					<div class="row marginTop">
						<div class="col-md-6">
		      		<%= f.label :nickname, "Nombre de usuario" %>
  						<%= f.text_field :nickname, class: 'form-control' %>
						</div>
					</div>
					<div class="row marginTop">
						<div class="col-md-6">
							<%= f.label :mail %>
  						<%= f.text_field :mail, class: 'form-control' %>
						</div>
					</div>
					<div class="row marginTop">
						<div class="col-md-6">
		    		  <%= f.label :walletNmb, "Nro Wallet" %>
  						<%= f.text_field :walletNmb , class: 'form-control' %>
						</div>
					</div>
					<div class="row marginTop">
						<div class="col-md-6">
		    		  <%= f.label :password, "Contraseña" %>
  						<%= f.password_field :password, class: 'form-control'  %>
						</div>
					</div>					 
  				<div class="row marginTop">
						<div class="col-md-6">
		    		  <%= f.label :password_confirmation, "Confirmacion" %>
  						<%= f.password_field :password_confirmation, class: 'form-control'  %>
						</div>
					</div>
					<div class="row marginTop">
						<div class="col-md-6">
							<%= f.submit "Crear cuenta", class: "btn btn-primary" %>
						</div>
					</div>

		    <% end %>
			</div>  			
    </div>
  </div>
</div>
</body>
</html>
